<template>
    <div>
<el-breadcrumb separator-class="el-icon-arrow-right">
  <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
  <el-breadcrumb-item>权限管理</el-breadcrumb-item>
  <el-breadcrumb-item>角色列表</el-breadcrumb-item>
</el-breadcrumb><br/><br/>
<el-table
      :data="right"
      style="width: 100%">
      <el-table-column
        type='index'
        label="序号"
        width="180">
      </el-table-column>
      <el-table-column
        prop="authName"
        label="权限名称"
        width="180">
      </el-table-column>
      <el-table-column
        prop="path"
        label="路径"
        width="180">
      </el-table-column>
      <el-table-column
        prop="level"
        label="权限层级"
        width="180">
        <template slot-scope='scope'>
        <el-tag v-if='scope.row.level==0'>一级</el-tag>
        <el-tag v-if='scope.row.level==1' type="success">二级</el-tag>
        <el-tag v-if='scope.row.level==2' type="warning">三级</el-tag>
        </template>
      </el-table-column>
    </el-table>
    </div>



</template>

<script>
import {Rights} from '../api/api.js';
export default {
    data() {
        return {
            right:[],
        }
    },
  mounted() {
      this.Rights()
  },

  methods: {
      async Rights(){
          let res=await Rights('list')
           console.log(res)
           this.right=res.data
      }
  }
};
</script>

<style lang='scss' scoped >
</style>
